/* shared CSS for widgets, required */
.fl { float: left; }
.fr { float: right; }
.clear { clear: both; }
.hidden { display: none; }

/* icons from JQueryUI, required by widgets */
.icon {
	overflow: hidden; float: left; width: 16px; height: 16px;
	background-image: url(images/icons_blue.png);
}
.icon-none { background: none; }
.icon-triangle-1-e { background-position: -32px -16px; }
.icon-triangle-1-n { background-position: 0 -16px; }
.icon-triangle-1-s { background-position: -64px -16px; }
.icon-minus { background-position: -48px -128px; }
.icon-plus { background-position: -16px -128px; }
.icon-search { background-position: -160px -112px; }

/* other icons, not required */
.icon-pencil { background-position: -64px -112px; }
.icon-disk { background-position: -96px -112px; }
.icon-newwin { background-position: -48px -80px; }
.icon-close { background-position: -80px -128px; }
.icon-arrowthick-1-e { background-position: -32px -48px; }
.icon-arrowthick-1-w { background-position: -96px -48px; }
.icon-alert { background-position: 0 -144px; }
.icon-check { background-position: -64px -144px; }
.icon-calendar { background-position: -32px -112px; }

body { overflow: hidden; background: #fff; margin: 0px; }
span.a { cursor: pointer; color: #339; }
a { text-decoration: none; color: #339; }
a:hover { color: #9C3; text-decoration: underline; }

button {
	cursor: pointer; border: 1px solid #fff; border-radius: 4px; color: #fff;
	font-size: 14px; height: 30px; width: auto; background: #2B7BBD; margin-right: 12px
}
button.a { background: transparent; height: auto; }
button[disabled] { background: #CCC; }

/** */
.form .item {
	margin: 8px 0px 8px 0px; clear: both; min-height: 24px;
}
.form .label {
	float: left; width: 120px; height: 24px; line-height: 24px;
	text-align: right; margin: 0px 8px 0px 0px;
}
.form>.item>.input>.picker {
	float: left; width: 24px; height: 24px; text-align: center;
	border-width: 1px 1px 1px 0px; border-style: solid; border-color: #CCC;
}
.form>.item>input[type=text] { float: left; border: 1px solid #CCC; height: 22px; }
.form>.item>input[type=text][readonly] { border-color: #EEE }
.form>.item>input[type=password] { float: left; border: 1px solid #CCC; height: 22px; }
.form>.item>input[type=number] { float: left; border: 1px solid #CCC; height: 22px; }
.form>.item>textarea { float: left; border: 1px solid #CCC; font-size: 14px; line-height: 22px; }
.form>.item>.value { float: left; height: 24px; line-height: 24px; margin: 0px 8px 0px 0px; }
.form>.item>.memo { float: left; line-height: 24px; margin: 0px 8px 0px 0px; }
.form .msg {
	height: 24px; line-height: 24px; margin: 12px 0px 0px 4px; color: red;
}
.form .bottom { height: 48px; line-height: 48px; text-align: center; }

.form .msg .icon { margin: 4px 0px 0px 4px; }
.form .msg.ok .icon { background: url(images/icons_blue.png) no-repeat -208px -192px; }
.form .msg.warn .icon { background: url(images/icons_yellow.png) no-repeat 0 -144px; }
.form .msg.error .icon { background: url(images/icons_red.png) no-repeat -32px -192px; }
/** */

/** */
.form2 { padding: 4px; font-size: 12px; }
.form2>.item {
	min-height: 24px; width: 326px; float: left;
	clear: none; margin: 4px 0px 4px 0px;
}
.form2 .label {
	float: left; width: 168px; height: 24px; line-height: 24px;
	text-align: right; margin: 0px 8px 0px 0px;
}
.form2 .input { float: left; }
.form2 .input>.picker {
	float: left; width: 24px; height: 24px; text-align: center;
	border-width: 1px 1px 1px 0px; border-style: solid; border-color: #FFF;
}
.form2 input[type=text] { width: 120px; border: 1px solid #CCC; height: 22px; }
.form2 input[type=text][readonly] { border-color: #EEE; background-color: #EEE; }
.form2 input[type=password] { float: left; border: 1px solid #CCC; height: 22px; }
.form2 input[type=number] { width: 120px; float: left; border: 1px solid #CCC; height: 22px; }
.form2 textarea { float: left; border: 1px solid #CCC; font-size: 14px; line-height: 22px; }
.form2 .value { float: left; height: 24px; line-height: 24px; margin: 0px 8px 0px 0px; }
.form2 .memo { float: left; line-height: 24px; margin: 0px 8px 0px 0px; }
.form2 .msg {
	height: 24px; line-height: 24px; margin: 12px 0px 0px 4px; color: red;
}
.form2 .bottom { height: 48px; line-height: 48px; text-align: center; }

.form2 .msg .icon { margin: 4px 0px 0px 4px; }
.form2 .msg.ok .icon { background: url(images/icons_blue.png) no-repeat -208px -192px; }
.form2 .msg.warn .icon { background: url(images/icons_yellow.png) no-repeat 0 -144px; }
.form2 .msg.error .icon { background: url(images/icons_red.png) no-repeat -32px -192px; }

.form2>.item.w2 { width: 654px; }
.form2>.item.w2 input[type=text] { width: 446px; }

.form2>.item.w3 { width: 972px; }
.form2>.item.w3>.box { line-height: 24px; float: left; }
.form2>.item.w3>.box>.col { float: left; }
/** */

.picker { float: left; width: 24px; height: 24px; cursor: pointer; background-color: #FFF; }
.picker .icon { background-position: -64px -112px; margin: 4px; }

.tabs>.body>.main>div>.head {
	padding: 8px 0px 0px 4px; height: 32px; line-height: 32px;
}
.tabs>.body>.main>div>.head .combo { margin-top: 2px; }
.tabs>.body>.main>div>.body { padding: 8px; }

.mask {
	background: #000; position: absolute; left: 0; top: 0;
	text-align: center; margin-top: 0; padding: 0; filter: alpha(opacity = 30);
	opacity: 0.3; width: 100%; height: 100%;
}

.dialog>.body>.head .combo { margin-top: 4px; }
.inline { display: -moz-inline-block; display: inline-block }

/*        */

#inbox {
	position: absolute; left: 0; top: 0; margin: 0 auto;
	overflow: hidden; z-index: 999; width: 320px;
}
#inbox>div { background-color: #FFF; border-bottom: 1px solid #CCC; cursor: pointer; }
#inbox>div .icon { margin-top: 4px; cursor: pointer; background-color: #FFF; }

#head {
	height: 60px; color: #FFFFFF; line-height: 60px;
	border-bottom: 2px solid #84b9e3;
	background-color: #388CD2;
}
#head>.main { float: left; margin-left: 30px; height: 40px; }
#head>.main .title { font-size: 32px; }
#head>.logon {
	float: right; width: auto; height: 40px; text-align: right;
	font-size: 14px; margin-right: 20px;
}
#head>.logon .a { margin-left: 24px }
#head>.logo {
	margin-top: 4px; background: url(./img/logo.png) transparent;
	width: 128px; height: 55px; background-size: 100% 100%;
}
#head>.title { height: 60px; line-height: 80px; }
#head span.a { color: #CCFFCC; }

#head .btn1 {
	width: 60px; height: 60px; border: none; cursor: pointer;
	background-color: transparent; background-repeat: no-repeat;
}
#head .btn1:hover { background-color: #2B7BBD; }

#head .leftBtn {
	margin-top: 5px;width: 50px !important; height: 50px !important; float: right;
	background-image: url(./img/menu1.png); background-size: 75%; background-position: center;
}
#head .leftBtn.on { background-color: #2B7BBD; }

#head .rightBtn {
	margin-top: 5px;width: 50px !important; height: 50px !important; float: right;
	background-image: url(./img/menu1.png); background-size: 75%; background-position: center;
	-moz-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH; /*IE*/
}

#head .rightBtn.on { background-color: #2B7BBD; }
#head .menuBtn {
	margin-top: 5px;width: 50px !important; height: 50px !important; float: right;
	background-image: url(./img/menu2.png); background-size: cover; background-position: center;
}
#head .backBtn { float: left; background-image: url(./img/back0.png); }
#head .saveBtn { float: right; background-image: url(./img/save0.png); }

#body { overflow: hidden; }
#body .infoPl { display: inline-block; white-space: nowrap; overflow: auto; }
#body .infoPl>div { padding: 8px 0px 0px 8px; }

#body .infoPl>div>.title { margin: 12px 0px 0px 12px; font-size: 24px; }
#body .infoPl>div>.form { margin: 12px }
#body .infoPl>div>.form>.item>input[type=text] { width: 338px; }
#body .infoPl>div>.form>.item>input[type=number] { width: 338px; }
#body .infoPl>div>.form>.item>span { height: 24px; line-height: 24px; }
#body .infoPl>div>.form>.item>textarea { width: 338px; height: 100px; }

#body .infoPl>div>.navi { height: 36px; line-height: 32px; font-size: 18px; }
#body .infoPl>div>.head { height: 36px; }
#body .infoPl>div>.body>.head { height: 48px; line-height: 48px; }
#body .infoPl>div .item >input[type=text] { width: 324px; }
#body .infoPl>div .item >textarea { width: 324px; }

#left {
	width: 240px; float: left; overflow-x: hidden; overflow-y: auto;
	border-right: 1px solid #CCC;
}
#left>.item {
	height: 26px; line-height: 26px; font-size: 18px; text-align: center;
}

#left .menu1>.head {
	height: 26px; line-height: 26px; font-size: 18px; text-align: left;
	background-color: #84b9e3; cursor: pointer; border-bottom: 1px solid #388CD2;
}
#left .menu1>.body {
	font-size: 14px; background-color: #FFF; padding-left: 16px;
}
#left .menu2>.head {
	height: 24px; line-height: 24px; font-size: 16px; cursor: pointer;
}
#left .menu2>.body { display: none; }

#main { float: left; overflow: hidden; }
#main>div>.title { font-size: 24px; }
#main>div>.form { margin: 12px }
#main>div>.form>.item>input[type=text] { width: 338px; }
#main>div>.form>.item>input[type=number] { width: 338px; }
#main>div>.form>.item>span { height: 24px; line-height: 24px; }
#main>div>.form>.item>textarea { width: 338px; height: 100px; }

#main>div>.navi { height: 36px; line-height: 32px; font-size: 18px; }
#main>div>.head { height: 36px; }
#main>div>.body>.head { height: 48px; line-height: 48px; }
/* #main>div .item >input[type=text] { width: 324px; } */
/* #main>div .item >textarea { width: 324px; } */

.grid>.main>.body>.tt>.expand {
	border-bottom: 1px solid #93C3CD; margin-right: 6px; border-right: 1px solid #93C3CD;
}
.grid>.pager { font-size: 12px; }

.datepicker { margin: 8px 0px 8px 0px; }
.datepicker input[type=checkbox] { margin: 0; vertical-align: middle; }
.datepicker .date10 { width: 80px; }
.datepicker .num2 { width: 32px; }

.tabs>.body>.main>div>.navi {
	height: 36px; line-height: 32px; font-size: 18px; margin-left: 8px;
}

.progress { background: url(css/images/pb.gif) no-repeat; background-size:100% 100%; }